//依赖 Polygon.js

/**
 * 图片形状构造函数
 * @param {String} imgSource 图片资源路径
 * @param {Number} x 初始位置x坐标
 * @param {Number} y 初始位置y坐标
 * @param {Number} w 宽度
 * @param {Number} h 高度
 */
function ImageShape (imgSource, x, y, w, h) {
    var self = this;
    this.image = new Image();
    this.imageLoaded = false;
    this.points = [ new Point(x, y) ];
    this.x = x;
    this.y = y;

    this.image.src = imgSource;
    this.image.addEventListener('load', function (e) {
        self.setPolygonPoints();
        self.imageLoaded = true;
    }, false);
}

ImageShape.prototype = (function (o) {
    var s = new Polygon();
    for(var p in o) {
        s[p] = o[p]
    }
    return s;
})({
    //重写fill函数，不做任何事
    fill: function (ctx) {
        //不做任何事
    },

    //初始化polygon顶点坐标
    setPolygonPoints: function () {
        this.points.push(new Point(this.x + this.image.width, this.y)); //右上角点
        this.points.push(new Point(this.x + this.image.width, this.y + this.image.height)); //右下角点
        this.points.push(new Point(this.x, this.y + this.image.height)); //坐下角点
        //左上角点：(this.x, this.y);
    },

    //绘制图片
    drawImage: function (ctx) {
        ctx.drawImage(this.image, this.points[0].x, this.points[0].y);
    },

    //绘制
    stroke: function (ctx) {
        var self = this;
        if(this.imageLoaded) {
            ctx.drawImage(this.image, this.points[0].x, this.points[0].y);
        } else {
            this.image.addEventListener('load', function (e) {
                self.drawImage(ctx);
            }, false);
        }
    }
})